<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Amaze UI Admin index Examples</title>
    <meta name="description" content="这是一个 index 页面">
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="icon" type="image/png" href="/assets/i/favicon.png">
    <link rel="apple-touch-icon-precomposed" href="/assets/i/app-icon72x72@2x.png">
    <meta name="apple-mobile-web-app-title" content="Amaze UI" />
    <link rel="stylesheet" href="/assets/css/amazeui.min.css" />
    <link rel="stylesheet" href="/assets/css/amazeui.datatables.min.css" />
    <link rel="stylesheet" href="/assets/css/app.css">
    <link rel="stylesheet" href="/css/default.css">
    <link rel="stylesheet" href="/css/tmpl.css">
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <script src="/assets/js/jquery.min.js"></script>
    <style>
        .tpl-table-list-select {
            text-align: left;
        }

        .input-label {
            width: auto;
            padding: 0em;
            margin: 0px;
            font-size: 1.1em;
            margin-right: 1em
        }

        .input-box {
            width: 30%;
            height: 2em;
            float: left;
            margin-bottom: 1em
        }

        .item-name {
            display: block;
            word-break: keep-all;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
    </style>
</head>

<body data-type="widgets">
    <script src="/assets/js/theme.js"></script>
    <div class="am-g tpl-g">
        <div id="head">
        </div>
        <div id="menu">
        </div>
        <!-- 风格切换 -->
        <div class="tpl-skiner">
            <div class="tpl-skiner-toggle am-icon-cog">
            </div>
            <div class="tpl-skiner-content">
                <div class="tpl-skiner-content-title">
                    选择主题
                </div>
                <div class="tpl-skiner-content-bar">
                    <span class="skiner-color skiner-white" data-color="theme-white"></span>
                    <span class="skiner-color skiner-black" data-color="theme-black"></span>
                </div>
            </div>
        </div>
        <!-- 侧边导航栏 -->


        <!-- 内容区域 -->
        <div class="tpl-content-wrapper" id="content">
            <div class="container-fluid am-cf">
                <div class="row">
                    <div class="am-u-sm-12 am-u-md-12 am-u-lg-9">
                        <div class="page-header-heading"><span class="am-icon-home page-header-heading-icon"></span> 订单
                            <small>订单审核</small></div>
                        <!--<p class="page-header-description">Amaze UI 有许多不同的表格可用。</p>-->
                    </div>
                    <!--<div class="am-u-lg-3 tpl-index-settings-button">-->
                    <!--<button type="button" class="page-header-button"><span class="am-icon-paint-brush"></span> 设置</button>-->
                    <!--</div>-->
                </div>

            </div>
            <div class="row-content am-cf">
                <div class="row">
                    <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
                        <div class="widget am-cf" style="min-height:500px">
                            <div class="widget-head am-cf">
                                <div class="widget-title  am-cf">待审核订单</div>
                            </div>
                            <template>
                                <el-table :data="tableData" style="width: 100%">
                                    <el-table-column prop="id" label="订单Id" width="180">
                                    </el-table-column>
                                    <el-table-column prop="transPrice" label="订单价格" width="180">
                                    </el-table-column>
                                    <el-table-column prop="name" label="订单商品" width="180">
                                        <template slot-scope="scope">
                                            <div v-for="(item,index) in scope.row.orderDetails">
                                                <a v-bind:href="'/item/itemDetails.html?itemid='+item.itemId" class="item-name">{{item.itemName}}</a>
                                            </div>
                                        </template>
                                    </el-table-column>
                                    <el-table-column label="支付类型" width="180">
                                        <template slot-scope="scope">
                                            <em v-if="scope.row.payType==1">线下支付</em>
                                            <em v-if="scope.row.payType==2">在线支付</em>
                                        </template>
                                    </el-table-column>
                                    <el-table-column prop="name" label="交易类型" width="180">
                                        <template slot-scope="scope">
                                            <em v-if="scope.row.tradeType==1">当面交易</em>
                                            <em v-if="scope.row.tradeType==2">上门自提</em>
                                            <em v-if="scope.row.tradeType==3">邮寄</em>
                                        </template>
                                    </el-table-column>
                                    <el-table-column prop="name" label="订单状态">
                                        <template slot-scope="scope">
                                            <em v-text="orderStatusFormatter(scope.row.orderStatus)">当面交易</em>
                                        </template>
                                    </el-table-column>
                                    <el-table-column fixed="right" width="150" prop="" label="操作">
                                        <template slot-scope="scope">
                                            <el-button @click="handleClick(scope.row)" type="text" size="small">查看
                                            </el-button>
                                            <el-button type="text" size="small" @click="checkOrder(scope.row.id,scope.row.orderStatus,'pass')">通过</el-button>
                                            <el-button type="text" size="small" @click="checkOrder(scope.row.id,scope.row.orderStatus,'unPass')">拒绝</el-button>
                                        </template>
                                    </el-table-column>
                                </el-table>
                            </template>
                            <!-- <el-pagination background layout="prev, pager, next" :total="1000" style="float:right">
                            </el-pagination> -->
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div>
    <script src="/assets/js/amazeui.min.js"></script>
    <script src="/assets/js/app.js"></script>
    <script src="/assets/js/handlebars.min.js"></script>
    <script src="/assets/js/amazeui.widgets.helper.js"></script>
    <script type="text/javascript" src="/layui/layui.js"></script>
    <script src="/js/vue.js"></script>
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <script src="/js/axios.min.js"></script>
    <script src="/js/common.js"></script>
    <script src="/order/js/orderCheck.js"></script>
</body>

</html>